<template lang="pug">
  div.page.page-4
    div.side-bar.left
      ModuleCollectionPoint(:areaData="areaData"  :realTimeData="realTimeData"  :leftTrend="leftTrend"  :F0000001="F0000001")
    div.center
    div.side-bar.right
      ModuleCheckPoint(:rightAreaData="rightAreaData"  :rightRealTimeData="rightRealTimeData"  :rightTrend="rightTrend"  :rightTopContent="rightTopContent")
</template>

<script>
import ModuleCollectionPoint from "./components/ModuleCollectionPoint";
import ModuleCheckPoint from "./components/ModuleCheckPoint";
import ModuleMapInfo from "./components/ModuleMapInfo";
import {mapMutations} from "vuex";
export default {
  name: "index",
  data() {
    return {
		F0000001:"0",
		leftTrend:[],
		realTimeData: [
		  {
		    label: '采集总数',
		    value: 0,
		    compare: {
		      label: '较昨日',
		      value: 0,
		    }
		  },
		  {
		    label: '打包总人数',
		    value: 0,
		    compare: {
		      label: '较昨日',
		      value: 0,
		    }
		  },
		],
		areaData: [
		  {
		    label: '芒市',
		    value: 0,
		  },
		  {
		    label: '瑞丽市',
		    value: 0,
		  },
		  {
		    label: '陇川县',
		    value: 0,
		  },
		  {
		    label: '盈江县',
		    value: 0,
		  },
		  {
		    label: '梁河县',
		    value: 0,
		  }

		],
		// 右侧数据
		rightTopContent:0,
		rightTrend:[],
		rightRealTimeData: [
		  {
		    label: '第一剂接种人数',
		    value: 0,
		    compare: {
		      label: '较昨日',
			  value: 0,
		    }
		  },
		  {
		    label: '第二剂接种人数',
		    value: 0,
		    compare: {
		      label: '较昨日',
		      value: 0,
		    }
		  },
		],
		rightAreaData: [
		  {
		    label: '芒市',
		    value: 0,
		  },
		  {
		    label: '瑞丽市',
		    value: 0,
		  },
		  {
		    label: '陇川县',
		    value: 0,
		  },
		  {
		    label: '盈江县',
		    value: 0,
		  },
		  {
		    label: '梁河县',
		    value: 0,
		  }

		],
		}
 },
  components: {
    ModuleCollectionPoint,
    ModuleCheckPoint,
    ModuleMapInfo,
  },
  methods: {
    ...mapMutations({
      // 设置点位
      setMarkers: 'map/SET_MARKERS',
      // 清除点位
      clearMarkers: 'map/CLEAR_MARKERS',
	  setNetworkError: 'network/SET_NETWORK_ERROR',
    }),
  	queryData() {

      let _self = this;
      _self.$axios.get('http://221.213.128.102:5000/0692/mappoint/mapPoint/getCYData?ActionName=getHsjcTop1&AppCode=D147210D147210D147210&Controller=BaseDataApiController&dataPrams={}').then(res => {
        if (res.data.success) {
          var re = res.data.result;
          var list = eval('(' + re + ')')
          var data = eval("(" + list.ReturnData.rsData + ")")
          _self.F0000001 = data[0].F0000113;
          _self.areaData[0].value = data[0].F0000007;
          _self.areaData[1].value = data[0].F0000003;
          _self.areaData[2].value = data[0].F0000001;
          _self.areaData[3].value = data[0].F0000005;
          _self.areaData[4].value = data[0].F0000108;
          _self.realTimeData[0].value = data[0].F0000113;
          _self.realTimeData[1].value = data[0].F0000114;
          let _self1 = _self;
          _self1.$axios.get('http://221.213.128.102:5000/0692/mappoint/mapPoint/getCYData?ActionName=getHsjcYtTop1&AppCode=D147210D147210D147210&Controller=BaseDataApiController&dataPrams={}').then(res => {
            if (res.data.success) {
              var re = res.data.result;
              var list = eval('(' + re + ')')
              var data = eval("(" + list.ReturnData.rsData + ")")
              _self1.realTimeData[0].compare.value = _self1.realTimeData[0].value - data[0].F0000113
              _self1.realTimeData[1].compare.value = _self1.realTimeData[1].value - data[0].F0000114

            } else {
              alert(res.data.message)
            }
          })

        } else {
          alert(res.data.message)
        }
      }).catch(err => {
        this.setNetworkError();
      })

      _self.$axios.get('http://221.213.128.102:5000/0692/mappoint/mapPoint/getCYData?ActionName=getHsjcTop6&AppCode=D147210D147210D147210&Controller=BaseDataApiController&dataPrams={}').then(res => {
        if (res.data.success) {
          var re = res.data.result;
          var list = eval('(' + re + ')')
          var data = eval("(" + list.ReturnData.rsData + ")")
          _self.leftTrend = data;

        } else {
          alert(res.data.message)
        }
      }).catch(err => {
        this.setNetworkError();
      })

      _self.$axios.get('http://221.213.128.102:5000/0692/mappoint/mapPoint/getCYData?ActionName=geAllTop6&AppCode=D147210D147210D147210&Controller=BaseDataApiController&dataPrams={}').then(res => {
        if (res.data.success) {
          var re = res.data.result;
          var list = eval('(' + re + ')')
          var data = eval("(" + list.ReturnData.rsData + ")")

          _self.rightTopContent = data[0].F0000004 + "%";

          _self.rightAreaData[0].value = data[0].F0000008;
          _self.rightAreaData[1].value = data[0].F0000012;
          _self.rightAreaData[2].value = data[0].F0000016;
          _self.rightAreaData[3].value = data[0].F0000020;
          _self.rightAreaData[4].value = data[0].F0000024;

          _self.rightRealTimeData[0].value = data[0].F0000002;
          _self.rightRealTimeData[1].value = data[0].F0000003;
          _self.rightRealTimeData[0].compare.value = parseInt(data[0].F0000002) - parseInt(data[1].F0000002);
          _self.rightRealTimeData[1].compare.value = parseInt(data[0].F0000003) - parseInt(data[1].F0000003);

          _self.rightTrend = data;

        } else {
          alert(res.data.message)
        }
      }).catch(err => {
        this.setNetworkError();
      })
    },
	queryJcData(){
		let _self = this;
		_self.$axios.get('http://221.213.128.102:5000/0692/mappoint/mapPoint/getCYData?ActionName=getHscyTop1&AppCode=D147210D147210D147210&Controller=BaseDataApiController&dataPrams={}').then(res => {
				if (res.data.success) {
					var re=res.data.result;
					var list=eval('(' + re + ')')
					var data=eval("("+list.ReturnData.rsData+")")

		  } else {
		    alert(res.data.message)
		  }
		}).catch(err => {
		   this.setNetworkError();
		})
	},
  	mockRenderMarkers() {
  		let _self = this;
  		_self.$axios.get('http://221.213.128.102:5000/0692//mappoint/mapPoint/getCYData?ActionName=geBJFKPoint&AppCode=D147210cyApi&Controller=ZTGLApiController&dataPrams={"dataName":"核酸检测"}').then(res => {
  			if (res.data.success) {
  				var re=res.data.result;
  				var list=eval('(' + re + ')')
  				var data=[]
  				if(list.ReturnData.rsData!="")
  					data=eval("("+list.ReturnData.rsData+")")
  				var datas=[];
  				data.forEach( function(item){
  					var dataJson = {}
  				     dataJson["lat"]=item.F0000004;
  					 dataJson["lng"]=item.F0000010;
  					 dataJson["label"]=item.F0000003;
  					 dataJson["type"]="green";
  					 datas.push(dataJson)
  				} )

  				this.setMarkers(datas);
  			} else {
  				alert(res.data.message)
  			}
  		}).catch(err => {
  		   this.setNetworkError();
  		})

  	}
  },
  mounted() {
  	  this.queryData();
	  this.queryJcData();
  	  this.mockRenderMarkers();
  	  /*
  	  this.timer = setInterval(() => {
  	         setTimeout(this.queryData(), 0)
  	   }, 2000*60)*/
  }
}
</script>

<style lang="scss" scoped>
.page-4{
  flex: 1;
  display: flex;
  .side-bar{
    display: flex;
    flex-direction: column;
    .content-placeholder{
      position: relative;
      z-index: 9;
    }
  }
  .center{
    flex: 1;
  }
}
</style>
